@import "variable";
.form-group{
    position: relative;
    border: 0;
    margin: 0.3rem;
    label{
        font-size: @big;
        line-height:@size * 0.6; 
    }
    &.input-border{
        input[type=color], input[type=date], 
        input[type=datetime-local], input[type=datetime], 
        input[type=email], input[type=month], input[type=number], 
        input[type=password], input[type=search], input[type=tel], 
        input[type=text], input[type=time], input[type=url], 
        input[type=week], select, textarea
        {
            line-height: @size * 0.8;
            width: 100%;
            height: @size * 0.8;
            padding: 10px 15px;
            -webkit-user-select: text;
            border: 1px solid rgba(0,0,0,.2);
            border-radius: 3px;
            outline: 0;
            background-color: #fff;
            -webkit-appearance: none;
            font-size: @big;
        }
        label{
            display: block;
        }
    }
}
.select-box {
    background-color: @mainColor;
    border-radius: @space / 2;
    .border();
    overflow: hidden;
    .flexCenter();
    .item {
        padding: @space / 2 @space;
        border-right: 1px solid @borderColor;
        background-color: #fff;
        &:last-child {
            border-right: none;
        }
        &.active {
            color: #fff;
            background-color: @mainColor;
        }
    }
}
.checkbox {
    overflow: hidden;
    input[type='checkbox'] {
        position: relative;
        opacity: 0;
    }
    input[type='checkbox']:checked + label {
        .check-border{
            font-size: .25rem;
            border-color: @mainColor;
            line-height: 0.9;
            text-align: center;
            &:before { 
                content: "\e62f"; 
            }
        }
    }
    label {
        display: inline-block;
        color: @mainColor;
        position: relative;
        //同意条款
        &.check-tip{
            font-size: .25rem;
            line-height: 1.4;
        }
        .check-border{
            margin-right: 2px;
            .border();
             vertical-align: text-bottom;
            border-color: @mainColor;
            width: .3rem;
            height: .3rem;
            display: inline-block;
        }
    }
}
.radiobox {
    overflow: hidden;
    input[type='radio'] {
        position: relative;
        opacity: 0;
    }
    input[type='radio']:checked + label {
        border-color: @mainColor;
        background-color: @mainColor;
    }
    label {
        display: inline-block;
        width: @size / 2;
        height: @size / 2;
        .border();
        color: #fff;
        position: relative;
        text-align: center;
    }
}